<template>
	<view class="wrap">
		<u-form class="form" :model="model" :rules="rules" ref="uForm" label-position="left">
			<u-calendar v-model="show" mode="date" @change="change" max-date="2099-12-31"></u-calendar>
			<u-form-item label="提交人" prop="leaveTime" label-width="180" v-if="model.leaveId">
				<u-input v-model="model.username" type="text" disabled="true" @click="show=true"></u-input>
			</u-form-item>
			<u-form-item label="开始时间" prop="leaveTime" label-width="180">
				<u-input v-model="model.leaveTime" type="text" disabled="true" @click="show=true"></u-input>
			</u-form-item>
			<u-form-item label="天数" prop="days" label-width="180">
				<u-input v-model="model.days" type="number"></u-input>
			</u-form-item>
			<u-form-item label="备注" prop="content" label-width="180">
				<u-input v-model="model.content" type="textarea"></u-input>
			</u-form-item>
		</u-form>
		<view class="form-footer">
			<u-button class="btn" type="primary" @click="create" v-if="!model.leaveId">创建</u-button>
			<u-button class="btn" type="primary" @click="submit" v-if="model.state === '0'">提交</u-button>
			<u-button class="btn" type="default" @click="cancel">关闭</u-button>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				show: false,
				isAdd: false,
				model: {
					leaveId: '',
					days: 1,
					content: '',
					leaveTime: '',
				},
				rules: {
					leaveTime: [{
						required: true,
						message: '请输入开始时间',
						trigger: ['change', 'blur'],
					}],
					days: [{
						required: true,
						message: '请输入天数',
						trigger: ['change', 'blur'],
					}]
				}
			};
		},
		onLoad(params) {
			if (!params.leaveId) {
				return false;
			}
			this.$u.api.unixOA.queryBill(params).then(res => {
				Object.assign(this.model, res.data);
			});
		},
		onReady() {

		},
		methods: {
			change(e) {
				this.model.leaveTime = e.result + " 00:00:00"
			},
			create() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						this.$u.api.unixOA.addTask(this.model).then(res => {
							uni.showModal({
								title: '提示',
								content: '提交成功',
								showCancel: false,
								success: function() {
									uni.navigateTo({
										url: '/pages/oa/history'
									})
								}
							});
						});

					} else {
						this.$u.toast('您填写的信息有误，请根据提示修正。');
					}
				});
			},
			submit() {
				this.$refs.uForm.validate(valid => {
					if (valid) {
						this.$u.api.unixOA.submitBill(this.model).then(res => {
							uni.showModal({
								title: '提示',
								content: '提交成功',
								showCancel: false,
								success: function() {
									uni.navigateTo({
										url: '/pages/oa/history'
									})
								}
							});
						});
			
					} else {
						this.$u.toast('您填写的信息有误，请根据提示修正。');
					}
				});
			},
			cancel() {
				uni.navigateBack();
			}
		}
	};
</script>
<style lang="scss">

</style>
